<!-- <template>
	<view>
		<view class="page-body">
			<view class="page-section page-sectio">
				<map style="width: 100%; height: 100vh;" :latitude="latitude" :longitude="longitude" :markers="covers" :scale="scale">
				</map>
			</view>
		</view>
	</view>
</template>

<script>
	import point from "@/static/aidex/position.png";
	export default {
		props: {
			equipment_name: String,
			coordinate:String,
		},
		data() {
			return {
				title: 'map',
				latitude: "",
				longitude: "",
				scale: 18,
				bottomData: false,
				covers: []
			}
		},
		created() {
			this.getMarkers()
		},
		watch: {
		  list: {
		    immediate: true,
		    handler(newList) {
		      if (newList && newList.length > 0 ) {
		        this.getMarkers(equipment_name,coordinate);
		      }
		    },
		  },
		},
		methods: {
			getMarkers() {
				console.log(this.equipment_name,this.coordinate)
				
				this.latitude=parseFloat(this.coordinate.split(',')[1])
				this.longitude=parseFloat(this.coordinate.split(',')[0])
				this.covers=[{
					latitude: parseFloat(this.coordinate.split(',')[1]),
					longitude: parseFloat(this.coordinate.split(',')[0]),
						iconPath: point,
						callout: {
							content: this.equipment_name,
							color: '#ffffff',
							fontSize: 14,
							borderRadius: 15,
							borderWidth: '10',
							bgColor: '#e51860',
							display: 'ALWAYS',
						}
				}]
				

			}
		}
	}
</script> -->